<template>
	<view class="address">
		<!-- <generalhead :title="title" :isHide="true"></generalhead> -->
		<view class="submitForm">
			<form>
				<view class="uni-form-item uni-column">
					<view class="title">收货人</view>
					<input class="uni-input" focus placeholder="请输入" v-model="addressForm.receiveName"/>
				</view>
				<view class="uni-form-item uni-column">
					<view class="title">国家/地区</view>
					<!-- <uni-section title="本地数据" type="line" class="input">
						<uni-data-select :localdata="range"></uni-data-select>
					</uni-section> -->
					<input class="uni-input" focus placeholder="国家/地区" v-model="addressForm.countryEgion"/>
				</view>
				<view class="uni-form-item uni-column">
					<view class="title">账号地址</view>
					<input class="uni-input" focus placeholder="街道地址和编号、邮政信箱、转交方" v-model="addressForm.street"/>
					<input class="uni-input" focus placeholder="公寓、套房、单元房、大厦、楼层等" v-model="addressForm.floor"/>
				</view>
				<view class="uni-form-item uni-column">
					<view class="title">州/省/地区</view>
					<input class="uni-input" focus placeholder="请输入" v-model="addressForm.regions"/>
				</view>
				<view class="uni-form-item uni-column">
					<view class="title">邮政编码</view>
					<input class="uni-input" focus placeholder="请输入" v-model="addressForm.postcode"/>
				</view>
				<view class="uni-form-item uni-column">
					<view class="title">注册邮箱</view>
					<input class="uni-input" focus placeholder="请输入" v-model="addressForm.mailbox"/>
				</view>
			</form>
		</view>
		<view class="save" @click="getSavaAddress">
			<view class="btn">
				保存收货地址
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	import generalhead from '../../compoents/generalhead.vue';
	
	import { NewAddress } from "@/api/Address.js"
	import { reactive } from 'vue'
	let title = "新增地址";
	interface Data {
		value : number,
		text : string,
	}
	// let receiveName = ref('')
	const addressForm = reactive({})
	let range : Array<Data> = [
		{ value: 0, text: "篮球" },
		{ value: 1, text: "足球" },
		{ value: 2, text: "游泳" },
	]
	const getSavaAddress = async() =>{
		console.log(addressForm,'addressForm');
		
		const res = await NewAddress(addressForm);
		if(res && res.code == 200){
			uni.navigateTo({
				url:'/pages/MyAddress/MyAddress'
			})
		}
		
		
	}


	
</script>

<style lang="less" scoped>
	@flex: {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.address {
		height: 100%;
		width: 100%;
		padding: 0 40rpx;
		background-color: #fff;


		.submitForm {
			margin-top: 40rpx;

			form {
				input {
					width: 100%;
					height: 90rpx;
					border-radius: 12rpx;
					background: #F2F2F2;
					padding-left: 20rpx;
				}

				.uni-column {
					.title {
						font-size: 28rpx;
						margin: 20rpx 0;
						font-weight: 600;
					}
				}

				.uni-column:nth-child(3) {
					input {
						margin: 30rpx 0;
					}
				}
			}
		}

		.save {
			padding: 10rpx 0;
			width: 100%;
			margin-top: 60rpx;
			@flex();

			.btn {
				width: 90%;
				height: 88rpx;
				border-radius: 44rpx;
				background: #E5353F;
				@flex();
				color: #fff;
				font-size: 30rpx;

			}
		}
	}
</style>